<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    
    <title>Supr admin</title>
    <meta name="author" content="SuggeElson" />
    <meta name="description" content="Supr admin template - new premium responsive admin template. This template is designed to help you build the site administration without losing valuable time.Template contains all the important functions which must have one backend system.Build on great twitter boostrap framework" />
    <meta name="keywords" content="admin, admin template, admin theme, responsive, responsive admin, responsive admin template, responsive theme, themeforest, 960 grid system, grid, grid theme, liquid, masonry, jquery, administration, administration template, administration theme, mobile, touch , responsive layout, boostrap, twitter boostrap" />
    <meta name="application-name" content="Supr admin template" />

    <!-- Mobile Specific Metas -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- Le styles -->

    <!-- Use new way for google web fonts 
    http://www.smashingmagazine.com/2012/07/11/avoiding-faux-weights-styles-google-web-fonts -->
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css' /> <!-- Headings -->
    <link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css' /> <!-- Text -->
    <!--[if lt IE 9]>
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:700" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Droid+Sans:400" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Droid+Sans:700" rel="stylesheet" type="text/css" />
    <![endif]-->

    <link href="css/bootstrap/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="css/bootstrap/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
    <link href="css/supr-theme/jquery.ui.supr.css" rel="stylesheet" type="text/css" />
    <link href="css/icons.css" rel="stylesheet" type="text/css" />
    <!-- Plugin stylesheets -->
    <link href="plugins/qtip/jquery.qtip.css" rel="stylesheet" type="text/css" />
    <link href="plugins/fullcalendar/fullcalendar.css" rel="stylesheet" type="text/css" />
    <link href="plugins/jpages/jPages.css" rel="stylesheet" type="text/css" />
    <link href="plugins/prettify/prettify.css" type="text/css" rel="stylesheet" />
    <link href="plugins/inputlimiter/jquery.inputlimiter.css" type="text/css" rel="stylesheet" />
    <link href="plugins/ibutton/jquery.ibutton.css" type="text/css" rel="stylesheet" />
    <link href="plugins/uniform/uniform.default.css" type="text/css" rel="stylesheet" />
    <link href="plugins/color-picker/color-picker.css" type="text/css" rel="stylesheet" />
    <link href="plugins/select/select2.css" type="text/css" rel="stylesheet" />
    <link href="plugins/validate/validate.css" type="text/css" rel="stylesheet" />
    <link href="plugins/pnotify/jquery.pnotify.default.css" type="text/css" rel="stylesheet" />
    <link href="plugins/pretty-photo/prettyPhoto.css" type="text/css" rel="stylesheet" />
    <link href="plugins/smartWizzard/smart_wizard.css" type="text/css" rel="stylesheet" />
    <link href="plugins/dataTables/jquery.dataTables.css" type="text/css" rel="stylesheet" />
    <link href="plugins/elfinder/elfinder.css" type="text/css" rel="stylesheet" />
    <link href="plugins/plupload/jquery.ui.plupload/css/jquery.ui.plupload.css" type="text/css" rel="stylesheet" />

    <!-- Main stylesheets -->
    <link href="css/main.css" rel="stylesheet" type="text/css" /> 

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <!--[if lt IE 9]>
        <link type="text/css" href="css/ie.css" rel="stylesheet" />
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="images/favicon.ico" />
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/apple-touch-icon-144-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/apple-touch-icon-114-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/apple-touch-icon-72-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" href="images/apple-touch-icon-57-precomposed.png" />

    <script type="text/javascript">
        //adding load class to body and hide page
        document.documentElement.className += 'loadstate';
    </script>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>
      
    <body>

    <!-- loading animation -->
    <div id="qLoverlay"></div>
    <div id="qLbar"></div>

    <div id="header">

        <div class="navbar">
            <div class="navbar-inner">
              <div class="container-fluid">
                <a class="brand" href="dashboard.html">Supr.<span class="slogan">admin</span></a>
                <div class="nav-no-collapse">
                    <ul class="nav">
                        <li><a href="dashboard.html"><span class="icon16 icomoon-icon-screen"></span> Dashboard</a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <span class="icon16 icomoon-icon-cog"></span> Settings
                                <b class="caret"></b>
                            </a>
                            <ul class="dropdown-menu">
                                <li class="menu">
                                    <ul>
                                        <li>                                                    
                                            <a href="#"><span class="icon16 iconic-icon-new-window"></span>Site config</a>
                                        </li>
                                        <li>                                                    
                                            <a href="#"><span class="icon16 icomoon-icon-wrench"></span>Plugins</a>
                                        </li>
                                        <li>
                                            <a href="#"><span class="icon16 icomoon-icon-picture-2"></span>Themes</a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <span class="icon16 icomoon-icon-mail"></span>Messages <span class="notification">8</span>
                            </a>
                            <ul class="dropdown-menu">
                                <li class="menu">
                                    <ul class="messages">    
                                        <li class="header"><strong>Messages</strong> (10) emails and (2) PM</li>
                                        <li>
                                           <span class="icon"><span class="icon16 icomoon-icon-user-2"></span></span>
                                            <span class="name"><a data-toggle="modal" href="#myModal1"><strong>Sammy Morerira</strong></a><span class="time">35 min ago</span></span>
                                            <span class="msg">I have question about new function ...</span>
                                        </li>
                                        <li>
                                           <span class="icon avatar"><img src="images/avatar.jpg" alt="" /></span>
                                            <span class="name"><a data-toggle="modal" href="#myModal1"><strong>George Michael</strong></a><span class="time">1 hour ago</span></span>
                                            <span class="msg">I need to meet you urgent please call me ...</span>
                                        </li>
                                        <li>
                                            <span class="icon"><span class="icon16 icomoon-icon-mail"></span></span>
                                            <span class="name"><a data-toggle="modal" href="#myModal1"><strong>Ivanovich</strong></a><span class="time">1 day ago</span></span>
                                            <span class="msg">I send you my suggestion, please look and ...</span>
                                        </li>
                                        <li class="view-all"><a href="#">View all messages <span class="icon16  icomoon-icon-arrow-right-7"></span></a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                  
                    <ul class="nav pull-right usernav">
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <span class="icon16 icomoon-icon-bell"></span><span class="notification">3</span>
                            </a>
                            <ul class="dropdown-menu">
                                <li class="menu">
                                    <ul class="notif">
                                        <li class="header"><strong>Notifications</strong> (3) items</li>
                                        <li>
                                            <a href="#">
                                                <span class="icon"><span class="icon16 icomoon-icon-user-2"></span></span>
                                                <span class="event">1 User is registred</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#">
                                                <span class="icon"><span class="icon16 icomoon-icon-comments-4"></span></span>
                                                <span class="event">Jony add 1 comment</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#">
                                                <span class="icon"><span class="icon16 icomoon-icon-new"></span></span>
                                                <span class="event">admin Julia added post</span>
                                            </a>
                                        </li>
                                        <li class="view-all"><a href="#">View all notifications <span class="icon16  icomoon-icon-arrow-right-7"></span></a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle avatar" data-toggle="dropdown">
                                <img src="images/avatar.jpg" alt="" class="image" /> 
                                <span class="txt">admin@supr.com</span>
                                <b class="caret"></b>
                            </a>
                            <ul class="dropdown-menu">
                                <li class="menu">
                                    <ul>
                                        <li>
                                            <a href="#"><span class="icon16 icomoon-icon-user-3"></span>Edit profile</a>
                                        </li>
                                        <li>
                                            <a href="#"><span class="icon16 icomoon-icon-comments-2"></span>Approve comments</a>
                                        </li>
                                        <li>
                                            <a href="#"><span class="icon16 entypo-icon-contact"></span>Add user</a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li><a href="index.html"><span class="icon16 icomoon-icon-exit"></span> Logout</a></li>
                    </ul>
                </div><!-- /.nav-collapse -->
              </div>
            </div><!-- /navbar-inner -->
          </div><!-- /navbar --> 

    </div><!-- End #header -->

    <div id="wrapper">

        <!--Responsive navigation button-->  
        <div class="resBtn">
            <a href="#"><span class="icon16 minia-icon-list-3"></span></a>
        </div>

        <!--Sidebar collapse button-->  
        <div class="collapseBtn">
             <a href="#" class="tipR" title="Hide sidebar"><span class="icon12 minia-icon-layout"></span></a>
        </div>

        <!--Sidebar background-->
        <div id="sidebarbg"></div>
        <!--Sidebar content-->
        <div id="sidebar">

            <div class="shortcuts">
                <ul>
                    <li><a href="#" title="Support section" class="tip"><span class="icon24 icomoon-icon-support"></span></a></li>
                    <li><a href="#" title="Database backup" class="tip"><span class="icon24 icomoon-icon-database"></span></a></li>
                    <li><a href="#" title="Sales statistics" class="tip"><span class="icon24 iconic-icon-chart"></span></a></li>
                    <li><a href="#" title="Write post" class="tip"><span class="icon24 icomoon-icon-pencil"></span></a></li>
                </ul>
            </div><!-- End search -->            

            <div class="sidenav">

                <div class="sidebar-widget" style="margin: -1px 0 0 0;">
                    <h5 class="title" style="margin-bottom:0">Navigation</h5>
                </div><!-- End .sidenav-widget -->

                <div class="mainnav">
                    <ul>
                        <li><a href="charts.html"><span class="icon16 icomoon-icon-stats-up"></span>Charts</a></li>
                        <li>
                            <a href="#"><span class="icon16 minia-icon-list-4"></span>Forms</a>
                            <ul class="sub">
                                <li><a href="forms.html"><span class="icon16 icomoon-icon-paper"></span>Forms Stuff</a></li>
                                <li><a href="forms-validation.html"><span class="icon16 icomoon-icon-paper"></span>Validation</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#"><span class="icon16 silk-icon-columns"></span>Tables</a>
                            <ul class="sub">
                                <li><a href="tables.html"><span class="icon16 icomoon-icon-arrow-right"></span>Static</a></li>
                                <li><a href="data-table.html"><span class="icon16 icomoon-icon-arrow-right"></span>Data table</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#"><span class="icon16 brocco-icon-grid"></span>UI Elements</a>
                            <ul class="sub">
                                <li><a href="icons.html"><span class="icon16 icomoon-icon-rocket"></span>Icons</a></li>
                                <li><a href="buttons.html"><span class="icon16 icomoon-icon-paper"></span>Buttons</a></li>
                                <li><a href="elements.html"><span class="icon16 minia-icon-cog"></span>Elements</a></li>
                            </ul>
                        </li>
                        <li><a href="typo.html"><span class="icon16 icomoon-icon-font"></span>Typography</a></li>
                        <li><a href="grid.html"><span class="icon16 icomoon-icon-grid-view"></span>Grid</a></li>
                        <li><a href="calendar.html"><span class="icon16 brocco-icon-calendar"></span>Calendar</a></li>
                        <li>
                            <a href="widgets.html"><span class="icon16 icomoon-icon-cube"></span>Widgets<span class="notification green">28</span></a>
                        </li>
                        <li><a href="file.html"><span class="icon16 icomoon-icon-upload-2"></span>File Manager</a></li>
                        <li>
                            <a href="#"><span class="icon16 icomoon-icon-paper"></span>Error pages<span class="notification">6</span></a>
                            <ul class="sub">
                                <li><a href="403.html"><span class="icon16 icomoon-icon-paper"></span>Error 403</a></li>
                                <li><a href="404.html"><span class="icon16 icomoon-icon-paper"></span>Error 404</a></li>
                                <li><a href="405.html"><span class="icon16 icomoon-icon-paper"></span>Error 405</a></li>
                                <li><a href="500.html"><span class="icon16 icomoon-icon-paper"></span>Error 500</a></li>
                                <li><a href="503.html"><span class="icon16 icomoon-icon-paper"></span>Error 503</a></li>
                                <li><a href="offline.html"><span class="icon16 icomoon-icon-paper"></span>Offline page</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#"><span class="icon16 iconic-icon-box"></span>Other pages<span class="notification blue">2</span></a>
                            <ul class="sub">
                                <li><a href="invoice.html"><span class="icon16 icomoon-icon-paper"></span>Invoice page</a></li>
                                <li><a href="profile.html"><span class="icon16 icomoon-icon-paper"></span>User profile</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div><!-- End sidenav -->

            <div class="sidebar-widget">
                <h5 class="title">Monthly Bandwidth Transfer</h5>
                <div class="content">
                    <span class="icon16 iconic-icon-transfer left"></span>
                    <div class="progress progress-mini progress-danger left tip" title="87%">
                      <div class="bar" style="width: 87%;"></div>
                    </div>
                    <span class="percent">87%</span>
                    <div class="stat">19419.94 / 12000 MB</div>
                </div>

            </div><!-- End .sidenav-widget -->

            <div class="sidebar-widget">
                <h5 class="title">Disk Space Usage</h5>
                <div class="content">
                    <span class="icon16 icomoon-icon-cloud left"></span>
                    <div class="progress progress-mini progress-success left tip" title="16%">
                      <div class="bar" style="width: 16%;"></div>
                    </div>
                    <span class="percent">16%</span>
                    <div class="stat">304.44 / 8000 MB</div>
                </div>

            </div><!-- End .sidenav-widget -->

            <div class="sidebar-widget">
                <h5 class="title">Ad sense stats</h5>
                <div class="content">
                    
                    <div class="stats">
                        <div class="item">
                            <div class="head clearfix">
                                <div class="txt">Advert View</div>
                            </div>
                            <span class="icon16 icomoon-icon-eye left"></span>
                            <div class="number">21,501</div>
                            <div class="change">
                                <span class="icon24 icomoon-icon-arrow-up green"></span>
                                5%
                            </div>
                            <span id="stat1" class="spark"></span>
                        </div>
                        <div class="item">
                            <div class="head clearfix">
                                <div class="txt">Clicks</div>
                            </div>
                            <span class="icon16 entypo-icon-thumbs-up left"></span>
                            <div class="number">308</div>
                            <div class="change">
                                <span class="icon24 icomoon-icon-arrow-down red"></span>
                                8%
                            </div>
                            <span id="stat2" class="spark"></span>
                        </div>
                        <div class="item">
                            <div class="head clearfix">
                                <div class="txt">Page CTR</div>
                            </div>
                            <span class="icon16 icomoon-icon-heart left"></span>
                            <div class="number">4%</div>
                            <div class="change">
                                <span class="icon24 icomoon-icon-arrow-down red"></span>
                                1%
                            </div>
                            <span id="stat3" class="spark"></span>
                        </div>
                        <div class="item">
                            <div class="head clearfix">
                                <div class="txt">Earn money</div>
                            </div>
                            <span class="icon16 icomoon-icon-calculate left"></span>
                            <div class="number">$376</div>
                            <div class="change">
                                <span class="icon24 icomoon-icon-arrow-up green"></span>
                                26%
                            </div>
                            <span id="stat4" class="spark"></span>
                        </div>
                    </div>

                </div>

            </div><!-- End .sidenav-widget -->

            <div class="sidebar-widget">
                <h5 class="title">Right now</h5>
                <div class="content">
                    <div class="rightnow">
                        <ul class="unstyled">
                            <li><span class="number">34</span><span class="icon16 icomoon-icon-new"></span>Posts</li>
                            <li><span class="number">7</span><span class="icon16 icomoon-icon-paper"></span>Pages</li>
                            <li><span class="number">14</span><span class="icon16 brocco-icon-list"></span>Categories</li>
                            <li><span class="number">201</span><span class="icon16 icomoon-icon-tag"></span>Tags</li>
                        </ul>
                    </div>
                </div>

            </div><!-- End .sidenav-widget -->

        </div><!-- End #sidebar -->

        <!--Body content-->
        <div id="content" class="clearfix">
            <div class="contentwrapper"><!--Content wrapper-->

                <div class="heading">

                    <h3>Forms</h3>                    

                    <div class="resBtnSearch">
                        <a href="#"><span class="icon16 brocco-icon-search"></span></a>
                    </div>

                    <div class="search">

                        <form id="searchform" action="#" />
                            <input type="text" class="top-search" placeholder="Search here ..." />
                            <input type="submit" class="search-btn" value="" />
                        </form>
                
                    </div><!-- End search -->
                    
                    <ul class="breadcrumb">
                        <li>You are here:</li>
                        <li>
                            <a href="#" class="tip" title="back to dashboard">
                                <span class="icon16 icomoon-icon-screen"></span>
                            </a> 
                            <span class="divider">
                                <span class="icon16 icomoon-icon-arrow-right"></span>
                            </span>
                        </li>
                        <li class="active">Forms</li>
                    </ul>

                </div><!-- End .heading-->
    				
                <!-- Build page from here: Usual with <div class="row-fluid"></div> -->

                    <div class="row-fluid">

                        <div class="span6">

                            <div class="box">

                                <div class="title">

                                    <h4>
                                        <span class="icon16 brocco-icon-grid"></span>
                                        <span>Text fields</span>
                                    </h4>
                                    
                                </div>
                                <div class="content">
                                   
                                    <form class="form-horizontal" action="#" />
                                        
                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Normal field</label>
                                                    <input class="span8" id="normalInput" type="text" />
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="focusedInput">Focused input</label>
                                                    <input class="span8 focused" id="focusedInput" type="text" value="This is focused…" />
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="password">Password input</label>
                                                    <input class="span8" id="passwordInput" type="password" />
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="tooltip">With tooltip</label>
                                                    <input class="span8 tip" id="tooltipInput" type="text" title="This is some tooltip" />
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid"> 
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="placeholder">With placeholder</label>
                                                    <input class="span8" id="placeholderInput" type="text" placeholder="This is placeholder text" />
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid"> 
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4">Read only input</label>
                                                    <input class="span8" type="text" readonly="readonly" value="Some value here" />
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="disabledInput">Disabled input</label>
                                                    <input class="span8 disabled" id="disabledInput" type="text" placeholder="Disabled input here…" disabled="disabled" />
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="maxlenght">Max lenght</label>
                                                    <input class="span8" id="maxlengthInput" type="text" placeholder="Max lenght 20 characters" maxlength="20" />
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">
                                                        Label hint
                                                        <span class="help-block">Some work has to be done</span>
                                                    </label>
                                                    <input class="span8" id="normalInput1" type="text" />
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="prependedInput">Prepended text</label>
                                                    <div class="input-prepend">
                                                        <span class="add-on">@</span><input class="span8" id="prependedInput" size="16" type="text" />
                                                    </div>
                                                    <span class="help-block blue span8">Here's some hint text</span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="appendedInput">Appended text</label>
                                                    <div class="input-append">
                                                        <input class="span8" id="appendedInput" size="16" type="text" /><span class="add-on">.00</span>
                                                    </div>
                                                    <span class="help-inline blue">Here's more help text</span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="appendedInputButton">Append with button</label>
                                                    <div class="input-append">
                                                        <input class="span8" id="appendedInputButton" size="16" type="text" /><button class="btn" type="button">Go!</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="tags">Tags</label>
                                                    <div class="span8 controls">
                                                        <input id="tags" type="text" value="awesome,nice" style="width:100%;" />
                                                    </div>
                                                </div>
                                            </div>  
                                        </div>  

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Grid fields</label>
                                                    <div class="grid-inputs span8">
                                                        <input class="span3" type="text" placeholder=".span2" />
                                                        <input class="span5" type="text" placeholder=".span4" />
                                                        <input class="span8" type="text" placeholder=".span6" />
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="textarea">File input</label>
                                                    <input type="file" name="fileinput" id="file" />
                                                </div>
                                            </div>  
                                        </div>
                                                                                

                                    </form>
                                 
                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->

                        <div class="span6">

                            <div class="box">

                                <div class="title">

                                    <h4>
                                        <span class="icon16 brocco-icon-grid"></span>
                                        <span>Textareas</span>
                                    </h4>
                                    
                                </div>
                                <div class="content">
                                    <form class="form-horizontal" action="#" />

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="textarea">Normal Textarea</label>
                                                    <textarea class="span8" id="textarea" rows="3"></textarea>
                                                </div>
                                            </div>
                                            
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="textarea">Elastic Textarea</label>
                                                    <textarea class="span8 elastic" id="textarea1" rows="3"></textarea>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="textarea">With Input limit</label>
                                                    <textarea class="span8 limit" id="textarea2" rows="3"></textarea>
                                                </div>
                                            </div>  
                                        </div>

                                    </form>
                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->

                        <div class="span6">

                            <div class="box" style="margin-top:27px;">

                                <div class="title">

                                    <h4>
                                        <span class="icon16 brocco-icon-grid"></span>
                                        <span>Masked input</span>
                                    </h4>
                                    
                                </div>
                                <div class="content">
                                    <form class="form-horizontal" action="#" />
                                        
                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Phone field</label>
                                                    <input class="span8 mask" id="mask-phone" type="text" />
                                                    <span class="help-block blue span8">(999) 999-9999</span>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Phone field + ext.</label>
                                                    <input class="span8 mask" id="mask-phoneExt" type="text" />
                                                    <span class="help-block blue span8">(999) 999-9999? x99999</span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">International phone</label>
                                                    <input class="span8 mask" id="mask-phoneInt" type="text" />
                                                    <span class="help-block blue span8">+40 999 999 999</span>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Date field</label>
                                                    <input class="span8 mask" id="mask-date" type="text" />
                                                    <span class="help-block blue span8">99/99/9999</span>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">SSN field</label>
                                                    <input class="span8 mask" id="mask-ssn" type="text" />
                                                    <span class="help-block blue span8">999-99-9999</span>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Product Key</label>
                                                    <input class="span8 mask" id="mask-productKey" type="text" />
                                                    <span class="help-block blue span8">a*-999-a999</span>
                                                </div>
                                            </div>  
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Eye Script</label>
                                                    <input class="span8 mask" id="mask-eyeScript" type="text" />
                                                    <span class="help-block blue span8">~9.99 ~9.99 999</span>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="normal">Percent</label>
                                                    <input class="span8 mask" id="mask-percent" type="text" />
                                                    <span class="help-block blue span8">99%</span>
                                                </div>
                                            </div>
                                        </div>

                                    </form>
                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->
                       

                    </div><!-- End .row-fluid -->

                    <div class="row-fluid">

                        <div class="span6">

                            <div class="box">

                                <div class="title">
                                    <h4>    
                                        <span>Radio and Checkboxes</span>
                                    </h4>
                                </div>

                                <div class="content">
                                   <form class="form-horizontal" action="#" />
                                        
                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Inline Checkboxes</label>
                                                    
                                                    <div class="left marginT5 marginR10">
                                                        <input type="checkbox" id="inlineCheckbox1" value="option1" checked="checked" class="styled" /> Checked
                                                    </div>
                                                    <div class="left marginT5 marginR10">
                                                        <input type="checkbox" id="inlineCheckbox2" value="option2" class="styled" /> Unchecked
                                                    </div>
                                                    <div class="left marginT5 marginR10">
                                                        <input type="checkbox" id="inlineCheckbox3" value="option3" disabled="disabled" class="styled" /> Disabled
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">

                                                    <label class="form-label span4" for="checkboxes">Checkboxes</label>
                                                    
                                                    <div class="span8 controls">
                                                        
                                                        <div class="left marginT5">
                                                            <input type="checkbox" name="optionsCheckboxList1" value="option1" class="styled" />
                                                            Option one is this and that—be sure to include why it's great
                                                        </div>
                                                        <div class="left marginT5">
                                                            <input type="checkbox" name="optionsCheckboxList2" value="option2" class="styled" />
                                                            Option two can also be checked and included in form results
                                                        </div>
                                                        <div class="left marginT5">
                                                            <input type="checkbox" name="optionsCheckboxList3" value="option3" class="styled" />
                                                            Option three can—yes, you guessed it—also be checked and included in form results
                                                        </div>   
                                                        
                                                    </div>
                                                    
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">

                                                    <label class="form-label span4" for="checkboxes">Radios</label>
                                                    
                                                    <div class="span8 controls">
                                                        
                                                        <div class="left marginT5">
                                                            <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="checked" />
                                                            Option one is this and that—be sure to include why it's great
                                                        </div>
                                                        <div class="left marginT5">
                                                            <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2" />
                                                            Option two can be something else and selecting it will deselect option one
                                                        </div>
                                                        <div class="left marginT5">
                                                            <input type="radio" name="optionsRadios" id="optionsRadios3" value="option2" disabled="disabled" />
                                                            Option three is disabled
                                                        </div>

                                                        <div class="left marginT5">
                                                            <select>
                                                                <option />Who
                                                                <option selected="selected" />What
                                                                <option />When
                                                                <option />Where
                                                                <option />How
                                                            </select>
                                                        </div>

                                                    </div>
                                                    
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">

                                                    <label class="form-label span4" for="checkboxes">Iphone style checkbox</label>
                                                    
                                                    <div class="span8 controls">
                                                        
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox4" checked="checked" class="ibutton" /> 
                                                        </div>
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox5" class="ibutton" />
                                                        </div>
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox6" disabled="disabled" class="ibutton" />
                                                        </div>

                                                    </div>
                                                    
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">

                                                    <label class="form-label span4" for="checkboxes">Other Label</label>
                                                    
                                                    <div class="span8 controls">
                                                        
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox7" checked="checked" class="ibutton1" /> 
                                                        </div>
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox8" class="ibutton1" />
                                                        </div>
                                                    
                                                    </div>
                                                    
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">

                                                    <label class="form-label span4" for="checkboxes">With custom icon</label>
                                                    
                                                    <div class="span8 controls">
                                                        
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox9" checked="checked" class="ibuttonCheck" /> 
                                                        </div>
                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox10" class="ibuttonCheck" />
                                                        </div>

                                                        <div class="left marginR10">
                                                            <input type="checkbox" id="inlineCheckbox11" disabled="disabled" class="ibuttonCheck" />
                                                        </div>
                                                    
                                                    </div>
                                                    
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">

                                                    <label class="form-label span4" for="checkboxes">Iphone style checkbox</label>
                                                    
                                                    <div class="span8 controls">
                                                        
                                                        <div class="left marginR10">
                                                            <input type="radio" id="inlineCheckbox12" checked="checked" class="ibutton" name="radio1" /> 
                                                        </div>
                                                        <div class="left marginR10">
                                                            <input type="radio" id="inlineCheckbox13" class="ibutton" name="radio1" />
                                                        </div>
                                                        <div class="left marginR10">
                                                            <input type="radio" id="inlineCheckbox14" disabled="disabled" class="ibutton" name="radio1" />
                                                        </div>

                                                    </div>
                                                    
                                                </div>
                                            </div> 
                                        </div>

                                    </form>
                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->

                        <div class="span6">

                            <div class="box">

                                <div class="title">
                                    <h4>    
                                        <span>Steppers and pickers</span>
                                    </h4>
                                </div>
                                
                                <div class="content">

                                    <form class="form-horizontal" action="#" />
                                        
                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Default stepper</label>
                                                    <div class="span8">
                                                        <span id="ns_0" class="ui-stepper">
                                                            <input id="ns_textbox_0" type="text" name="ns_textbox_0" size="2" autocomplete="off" class="ui-stepper-textbox" />
                                                            <button name="ns_button_1_0" value="1" class="ui-stepper-plus btn" type="button">+</button>
                                                            <button name="ns_button_2_0" value="-1" class="ui-stepper-minus btn" type="button">-</button>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Custom step size</label>
                                                    <div class="span8">
                                                        <span id="ns_1" class="ui-stepper">
                                                            <input id="ns_textbox_1" type="text" name="ns_textbox_1" size="2" autocomplete="off" class="ui-stepper-textbox" />
                                                            <button name="ns_button_1_1" value="1" class="ui-stepper-plus btn" type="button">+</button>
                                                            <button name="ns_button_2_1" value="-1" class="ui-stepper-minus btn" type="button">-</button>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Decimal value</label>
                                                    <div class="span8">
                                                        <span id="ns_2" class="ui-stepper">
                                                            <input id="ns_textbox_2" type="text" name="ns_textbox_2" size="2" autocomplete="off" class="ui-stepper-textbox" />
                                                            <button name="ns_button_1_2" value="1" class="ui-stepper-plus btn" type="button">+</button>
                                                            <button name="ns_button_2_2" value="-1" class="ui-stepper-minus btn" type="button">-</button>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Currency value</label>
                                                    <div class="span8">
                                                        <span id="ns_3" class="ui-stepper">
                                                            <input id="ns_textbox_3" type="text" name="ns_textbox_3" size="5" autocomplete="off" class="ui-stepper-textbox" />
                                                            <button name="ns_button_1_3" value="1" class="ui-stepper-plus btn" type="button">+</button>
                                                            <button name="ns_button_2_3" value="-1" class="ui-stepper-minus btn" type="button">-</button>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Color picker</label>
                                                    <div class="span8" style="position:relative;">
                                                        <input type="text" id="color" name="color" value="#123456" /><div class="picker"></div>
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Date picker</label>
                                                    <div class="span2">
                                                        <input type="text" id="datepicker" />
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Inline date picker</label>
                                                    <div class="span8" id="datepicker-inline"></div>
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Time picker</label>
                                                    <div class="span2">
                                                        <input id="timepicker" type="text" name="time" autocomplete="off" />
                                                      
                                                    </div>
                                                </div>
                                            </div> 
                                        </div>
                                        
                                    </form>   
                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->
                       

                    </div><!-- End .row-fluid -->

                    <div class="row-fluid">

                        <div class="span6">

                            <div class="box">

                                <div class="title">

                                    <h4>
                                        <span>Selects</span>
                                    </h4>
                                    
                                </div>

                                <div class="content">

                                    <form class="horizontal" />

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Simple select</label>
                                                    <div class="span8 controls">   
                                                        <select name="select">
                                                            <option />Who
                                                            <option selected="selected" />What
                                                            <option />When
                                                            <option />Where
                                                            <option />How
                                                        </select>
                                                    </div> 
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Simple Multiselect</label>
                                                    <div class="span8 controls">   
                                                        <select name="select" class="nostyle" multiple="multiple">
                                                            <option />Who
                                                            <option selected="selected" />What
                                                            <option />When
                                                            <option />Where
                                                            <option />How
                                                        </select>
                                                    </div> 
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Select with filter</label>
                                                    <div class="span8 controls">   
                                                        <select name="select" id="select1" class="nostyle" style="width:100%;">
                                                           <optgroup label="Alaskan/Hawaiian Time Zone">
                                                               <option value="AK" />Alaska
                                                               <option value="HI" />Hawaii
                                                           </optgroup>
                                                           <optgroup label="Pacific Time Zone">
                                                               <option value="CA" />California
                                                               <option value="NV" />Nevada
                                                               <option value="OR" />Oregon
                                                               <option value="WA" />Washington
                                                           </optgroup>
                                                           <optgroup label="Mountain Time Zone">
                                                               <option value="AZ" />Arizona
                                                               <option value="CO" />Colorado
                                                               <option value="ID" />Idaho
                                                               <option value="MT" />Montana<option value="NE" />Nebraska
                                                               <option value="NM" />New Mexico
                                                               <option value="ND" />North Dakota
                                                               <option value="UT" />Utah
                                                               <option value="WY" />Wyoming
                                                           </optgroup>
                                                           <optgroup label="Central Time Zone">
                                                               <option value="AL" />Alabama
                                                               <option value="AR" />Arkansas
                                                               <option value="IL" />Illinois
                                                               <option value="IA" />Iowa
                                                               <option value="KS" />Kansas
                                                               <option value="KY" />Kentucky
                                                               <option value="LA" />Louisiana
                                                               <option value="MN" />Minnesota
                                                               <option value="MS" />Mississippi
                                                               <option value="MO" />Missouri
                                                               <option value="OK" />Oklahoma
                                                               <option value="SD" />South Dakota
                                                               <option value="TX" />Texas
                                                               <option value="TN" />Tennessee
                                                               <option value="WI" />Wisconsin
                                                           </optgroup>
                                                           <optgroup label="Eastern Time Zone">
                                                               <option value="CT" />Connecticut
                                                               <option value="DE" />Delaware
                                                               <option value="FL" />Florida
                                                               <option value="GA" />Georgia
                                                               <option value="IN" />Indiana
                                                               <option value="ME" />Maine
                                                               <option value="MD" />Maryland
                                                               <option value="MA" />Massachusetts
                                                               <option value="MI" />Michigan
                                                               <option value="NH" />New Hampshire<option value="NJ" />New Jersey
                                                               <option value="NY" />New York
                                                               <option value="NC" />North Carolina
                                                               <option value="OH" />Ohio
                                                               <option value="PA" />Pennsylvania<option value="RI" />Rhode Island<option value="SC" />South Carolina
                                                               <option value="VT" />Vermont<option value="VA" />Virginia
                                                               <option value="WV" />West Virginia
                                                           </optgroup>
                                                          </select>
                                                    </div> 
                                                </div>
                                            </div> 
                                        </div>

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="row-fluid">
                                                    <label class="form-label span4" for="checkboxes">Multiple select with filter</label>
                                                    <div class="span8 controls">   
                                                        <select name="select" id="select2" class="nostyle" style="width:100%;" multiple="multiple">
                                                           <optgroup label="Alaskan/Hawaiian Time Zone">
                                                               <option value="AK" />Alaska
                                                               <option value="HI" />Hawaii
                                                           </optgroup>
                                                           <optgroup label="Pacific Time Zone">
                                                               <option value="CA" />California
                                                               <option value="NV" />Nevada
                                                               <option value="OR" />Oregon
                                                               <option value="WA" />Washington
                                                           </optgroup>
                                                           <optgroup label="Mountain Time Zone">
                                                               <option value="AZ" />Arizona
                                                               <option value="CO" />Colorado
                                                               <option value="ID" />Idaho
                                                               <option value="MT" />Montana<option value="NE" />Nebraska
                                                               <option value="NM" />New Mexico
                                                               <option value="ND" />North Dakota
                                                               <option value="UT" />Utah
                                                               <option value="WY" />Wyoming
                                                           </optgroup>
                                                           <optgroup label="Central Time Zone">
                                                               <option value="AL" />Alabama
                                                               <option value="AR" />Arkansas
                                                               <option value="IL" />Illinois
                                                               <option value="IA" />Iowa
                                                               <option value="KS" />Kansas
                                                               <option value="KY" />Kentucky
                                                               <option value="LA" />Louisiana
                                                               <option value="MN" />Minnesota
                                                               <option value="MS" />Mississippi
                                                               <option value="MO" />Missouri
                                                               <option value="OK" />Oklahoma
                                                               <option value="SD" />South Dakota
                                                               <option value="TX" />Texas
                                                               <option value="TN" />Tennessee
                                                               <option value="WI" />Wisconsin
                                                           </optgroup>
                                                           <optgroup label="Eastern Time Zone">
                                                               <option value="CT" />Connecticut
                                                               <option value="DE" />Delaware
                                                               <option value="FL" />Florida
                                                               <option value="GA" />Georgia
                                                               <option value="IN" />Indiana
                                                               <option value="ME" />Maine
                                                               <option value="MD" />Maryland
                                                               <option value="MA" />Massachusetts
                                                               <option value="MI" />Michigan
                                                               <option value="NH" />New Hampshire<option value="NJ" />New Jersey
                                                               <option value="NY" />New York
                                                               <option value="NC" />North Carolina
                                                               <option value="OH" />Ohio
                                                               <option value="PA" />Pennsylvania<option value="RI" />Rhode Island<option value="SC" />South Carolina
                                                               <option value="VT" />Vermont<option value="VA" />Virginia
                                                               <option value="WV" />West Virginia
                                                           </optgroup>
                                                          </select>
                                                    </div> 
                                                </div>
                                            </div> 
                                        </div>

                                    </form>

                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->

                        <div class="span6">

                            <div class="box">

                                <div class="title">

                                    <h4>
                                        <span>Dual multi select</span>
                                    </h4>
                                </div>
                                <div class="content">

                                    <form class="form-horizontal" action="#" />

                                        <div class="form-row row-fluid">
                                            <div class="span12">
                                                <div class="leftBox">
                                                    <div class="searchBox"><input type="text" id="box1Filter" class="searchField" placeholder="filter ..." /><button id="box1Clear" type="button" class="btn"><span class="icon12 entypo-icon-cancel"></span></button></div>
                                                    
                                                    <select id="box1View" multiple="multiple" class="multiple nostyle" style="height:300px;">
                                                        <option value="1" />Spain
                                                        <option value="2" />Germany
                                                        <option value="3" />Uruguay
                                                        <option value="4" selected="selected" />Brazil
                                                        <option value="5" selected="selected" />England
                                                        <option value="6" selected="selected" />Portugal
                                                        <option value="7" />Argentina
                                                        <option value="8" />Italy
                                                        <option value="9" />Croatia
                                                        <option value="10" />Denmark
                                                        <option value="11" />Russia
                                                        <option value="12" />Greece
                                                        <option value="13" />Chile
                                                        <option value="14" />Côte d'Ivoire
                                                        <option value="15" selected="selected" />France
                                                        <option value="16" />Sweden
                                                        <option value="17" />Switzerland
                                                        <option value="18" />Republic of Ireland
                                                        <option value="19" />Australia
                                                    </select>
                                                    <br />
                                                    <span id="box1Counter" class="count"></span>
                                                    
                                                    <div class="dn"><select id="box1Storage" name="box1Storage" class="nostyle"></select></div>
                                                </div>
                                                    
                                                <div class="dualBtn">
                                                    
                                                    <button id="to2" type="button" class="btn"><span class="icon12 minia-icon-arrow-right-3"></span></button>
                                                    <button id="allTo2" type="button" class="btn"><span class="icon12 iconic-icon-last"></span></button>
                                                    <button id="to1" type="button" class="btn marginT5"><span class="icon12 minia-icon-arrow-left-3"></span></button>
                                                    <button id="allTo1" type="button" class="btn marginT5"><span class="icon12 iconic-icon-first"></span></button>
                                                    
                                                </div>
                                                    
                                                <div class="rightBox">
                                                    <div class="searchBox"><input type="text" id="box2Filter" class="searchField" placeholder="filter ..." /><button id="box2Clear" type="button" class="btn"><span class="icon12 entypo-icon-cancel"></span></button></div>
                                                    <select id="box2View" multiple="multiple" class="multiple nostyle" style="height:300px;"></select><br />
                                                    <span id="box2Counter" class="count"></span>
                                                    
                                                    <div class="dn"><select id="box2Storage" class="nostyle"></select></div>
                                                </div>

                                            </div> 
                                        </div>

                                    </form>

                                </div>

                            </div><!-- End .box -->

                        </div><!-- End .span6 -->

                    </div><!-- End .row-fluid -->

                    <div class="row-fluid">

                        <div class="span12">

                            <div class="page-header">
                                <h4>TinyMce WYSIWYG editor</h4>
                            </div>

                            <form class="form-inline" />
                                <div class="form-row">
                                    <textarea class="tinymce" name="sometext" style="width:90%;"></textarea>
                                </div>
                            </form>
                        </div>

                    </div><!-- End .row-fluid -->
               
    			<!-- Page end here -->
    				
                <div class="modal fade hide" id="myModal1">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span class="icon12 minia-icon-close"></span></button>
                        <h3>Chat layout</h3>
                    </div>
                    <div class="modal-body">
                        <ul class="messages">
                            <li class="user clearfix">
                                <a href="#" class="avatar">
                                    <img src="images/avatar2.jpeg" alt="" />
                                </a>
                                <div class="message">
                                    <div class="head clearfix">
                                        <span class="name"><strong>Lazar</strong> says:</span>
                                        <span class="time">25 seconds ago</span>
                                    </div>
                                    <p>
                                        Time to go i call you tomorrow.
                                    </p>
                                </div>
                            </li>
                            <li class="admin clearfix">
                                <a href="#" class="avatar">
                                    <img src="images/avatar3.jpeg" alt="" />
                                </a>
                                <div class="message">
                                    <div class="head clearfix">
                                        <span class="name"><strong>Sugge</strong> says:</span>
                                        <span class="time">just now</span>
                                    </div>
                                    <p>
                                        OK, have a nice day.
                                    </p>
                                </div>
                            </li>

                            <li class="sendMsg">
                                <form class="form-horizontal" action="#" />
                                    <textarea class="elastic" id="textarea5" rows="1" placeholder="Enter your message ..." style="width:98%;"></textarea>
                                    <button type="submit" class="btn btn-info marginT10">Send message</button>
                                </form>
                            </li>
                            
                        </ul>
                    </div>
                    <div class="modal-footer">
                        <a href="#" class="btn" data-dismiss="modal">Close</a>
                    </div>
                </div>
                
            </div><!-- End contentwrapper -->
        </div><!-- End #content -->
    
    </div><!-- End #wrapper -->

    <!-- Le javascript
    ================================================== -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>  
    <script type="text/javascript" src="js/jquery.cookie.js"></script>
    <script type="text/javascript" src="js/jquery.mousewheel.js"></script>

    <!-- Load plugins -->
    <script type="text/javascript" src="plugins/qtip/jquery.qtip.min.js"></script>
    <script type="text/javascript" src="plugins/flot/jquery.flot.js"></script>
    <script type="text/javascript" src="plugins/flot/jquery.flot.grow.js"></script>
    <script type="text/javascript" src="plugins/flot/jquery.flot.pie.js"></script>
    <script type="text/javascript" src="plugins/flot/jquery.flot.resize.js"></script>
    <script type="text/javascript" src="plugins/flot/jquery.flot.tooltip_0.4.4.js"></script>
    <script type="text/javascript" src="plugins/flot/jquery.flot.orderBars.js"></script>

    <script type="text/javascript" src="plugins/sparkline/jquery.sparkline.min.js"></script>
    <script type="text/javascript" src="plugins/knob/jquery.knob.js"></script>
    <script type="text/javascript" src="plugins/fullcalendar/fullcalendar.min.js"></script>
    <script type="text/javascript" src="plugins/prettify/prettify.js"></script>

    <script type="text/javascript" src="plugins/watermark/jquery.watermark.min.js"></script>
    <script type="text/javascript" src="plugins/elastic/jquery.elastic.js"></script>
    <script type="text/javascript" src="plugins/inputlimiter/jquery.inputlimiter.1.3.min.js"></script>
    <script type="text/javascript" src="plugins/maskedinput/jquery.maskedinput-1.3.min.js"></script>
    <script type="text/javascript" src="plugins/ibutton/jquery.ibutton.min.js"></script>
    <script type="text/javascript" src="plugins/uniform/jquery.uniform.min.js"></script>
    <script type="text/javascript" src="plugins/stepper/ui.stepper.js"></script>
    <script type="text/javascript" src="plugins/color-picker/colorpicker.js"></script>
    <script type="text/javascript" src="plugins/timeentry/jquery.timeentry.min.js"></script>
    <script type="text/javascript" src="plugins/select/select2.min.js"></script>
    <script type="text/javascript" src="plugins/dualselect/jquery.dualListBox-1.3.min.js"></script>
    <script type="text/javascript" src="plugins/tiny_mce/jquery.tinymce.js"></script>
    <script type="text/javascript" src="plugins/validate/jquery.validate.min.js"></script>

    <script type="text/javascript" src="plugins/animated-progress-bar/jquery.progressbar.js"></script>
    <script type="text/javascript" src="plugins/pnotify/jquery.pnotify.min.js"></script>
    <script type="text/javascript" src="plugins/lazy-load/jquery.lazyload.min.js"></script>
    <script type="text/javascript" src="plugins/jpages/jPages.min.js"></script>
    <script type="text/javascript" src="plugins/pretty-photo/jquery.prettyPhoto.js"></script>
    <script type="text/javascript" src="plugins/smartWizzard/jquery.smartWizard-2.0.min.js"></script>

    <script type="text/javascript" src="plugins/touch-punch/jquery.ui.touch-punch.min.js"></script>
    <script type="text/javascript" src="plugins/ios-fix/ios-orientationchange-fix.js"></script>

    <script type="text/javascript" src="plugins/dataTables/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="plugins/elfinder/elfinder.min.js"></script>
    <script type="text/javascript" src="plugins/plupload/plupload.js"></script>
    <script type="text/javascript" src="plugins/plupload/plupload.html4.js"></script>
    <script type="text/javascript" src="plugins/plupload/jquery.plupload.queue/jquery.plupload.queue.js"></script>


    <!-- Init plugins -->
    <script type="text/javascript" src="js/statistic.js"></script><!-- Control graphs ( chart, pies and etc) -->

    <!-- Important Place before main.js  -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/main.js"></script>
   

    </body>
</html>
